<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>表单选择器</title>
		<script src="js/jquery-3.3.1.min.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
			$(function(){
				$("input:enabled").css("color","red");//可用
				$("input:disabled").css("color","blue");//不可用
				$(":checked").css("background-color","red");//选中
				$(":checked").wrap("<span style='background-color:red;'></span>");//在当前标签上加新标签
				$(":selected").css("background-color","red");//选择的选项
			})
		</script>
	</head>
	<body>
		
		<h3> 表单对象属性过滤选择器.</h3>
		<form id="form1" action="#">
		<button type="reset">重置所有表单元素</button>
		<br /><br />
		你经常使用的网络购物平台是？<br/>
		<input type="checkbox"  name="newsletter" checked="checked" value="1" />淘宝/天猫
		<input type="checkbox" name="newsletter" value="2" />京东
		<input type="checkbox" name="newsletter" value="3" />当当
		<input type="checkbox" name="newsletter" checked="checked" value="4" />亚马逊
		<div></div<br/><br/>
		你最喜欢的水果？<br/>
		<select name="test" multiple="multiple" style="height:100px">
		<option>苹果</option>
		<option selected="selected">香蕉</option>
		<option>芒果</option>
		<option selected="selected">木瓜</option>
		<option>雪梨</option>
		<option>草莓</option>
		</select>
		你最喜欢的通讯软件：<br/>
		<select name="test2" >
		<option>QQ</option>
		<option>陌陌</option>
		<option selected="selected">微信</option>
		<option>支付宝</option>
		<option>iMessage</option>
		<option>其他</option>
		</select>
		<br/><br/>
		<div></div>
		<br />
		<br /> 可用元素：&nbsp;&nbsp;
		<input name="add" value="可用文本框" />
		<br/> 不可用元素：
		<input name="email" disabled="disabled" value="不可用文本框" />
		<br/> 可用元素：&nbsp;&nbsp;
		<input name="che" value="可用文本框" />
		<br/> 不可用元素：
		<input name="name" disabled="disabled" value="不可用文本框" />
		</form>
	</body>
</html>
